<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
    <link th:href="@{/erp/assets/css/codemirror.css}" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}"/>
    <!--[if IE 7]>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome-ie7.min.css}"/>
    <![endif]-->
    <!--[if lte IE 8]>
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace-ie.min.css}"/>
    <![endif]-->
    <script th:src="@{/erp/js/jquery-1.9.1.min.js}"></script>
    <script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
    <script type="text/javascript" th:src="@{erp//Widget/Validform/5.3.2/Validform.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.dataTables.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.dataTables.bootstrap.js}"></script>
    <script th:src="@{/erp/assets/js/typeahead-bs2.min.js}"></script>
    <script th:src="@{/erp/assets/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/erp/assets/js/jquery-ui-1.10.3.custom.min.js}"></script>
    <script th:src="@{/erp/assets/js/jquery.ui.touch-punch.min.js}"></script>
    <script th:src="@{/erp/assets/js/ace-elements.min.js}"></script>
    <script th:src="@{/erp/assets/js/ace.min.js}"></script>
    <script th:src="@{/erp/js/lrtk.js}" type="text/javascript"></script>
    <script th:src="@{/erp/assets/laydate/laydate.js}" type="text/javascript"></script>
    <title>订单打印</title>
    <style>
        #order .label_name{
            margin: 0;
            padding: 0;
            display: inline-block;
            width: 500px;
            text-align: left;
        }
    </style>
</head>
<body>

<div class="margin clearfix">
    <div class="stystems_style">
        <div class="tabbable">
            <div class="page-content clearfix">
                <div id="Member_Ratings">
                    <br/>
                    <h2 align="center" th:text="订单信息"></h2>
                    <br/>
                    <div id="order">
                        <label class="label_name"  th:text="'购货人:'+${detailMessage.company_name}"></label>
                        <label class="label_name"  th:text="'付款日期:'+${#dates.format(detailMessage.deal_time,'yyyy-MM-dd')}"></label>
                        <label class="label_name"  >发货单号：未发货</label>
                        <label class="label_name"  th:text="'付款时间:'+${#dates.format(detailMessage.deal_time,'HH:mm:ss')}"></label>
                        <label class="label_name"  >发货时间':无</label>
                        <label class="label_name"  >配送方式:未发货</label>
                        <label class="label_name" >支付方式：支付宝</label>
                        <label class="label_name"  th:text="'手机：'+${detailMessage.legal_tel}"></label>
                        <label class="label_name"  th:text="'电话：'+${detailMessage.fixed_tel}"></label>
                        <label class="label_name"  th:text="'收货地址：'+${detailMessage.company_province+detailMessage.company_city+detailMessage.company_area+detailMessage.company_address}"></label>
                        <label class="label_name"  th:text="'电话：'+${detailMessage.company_name}">收货人：张三</label>
                        <label class="label_name" >邮编：456150</label><br/>
                    </div>

                    <div class="tab-content">
                        <div id="home" class="tab-pane active">
                            <table class="table table-striped table-bordered table-hover" id="sample-table">
                                <thead>
                                <tr>
                                    <th width="100">订单编号</th>
                                    <th width="100">商品名称</th>
                                    <th width="100">货号</th>
                                    <th width="80">属性</th>
                                    <th width="100">价格</th>
                                    <th width="100">数量</th>
                                    <th width="100">小计</th>
                                    <th hidden="hidden"></th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                    <td th:text="${detailMessage.order_id}"></td>
                                    <td th:text="${detailMessage.p_name}"></td>
                                    <td th:text="${detailMessage.p_number}"></td>
                                    <td th:text="${detailMessage.p_kind}"></td>
                                    <td th:text="${detailMessage.p_price}"></td>
                                    <td th:text="${detailMessage.number}"></td>
                                    <td th:text="${detailMessage.p_price*detailMessage.number}"></td>
                                    <td hidden="hidden"></td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div style="position: absolute;right: 100px;">
                        <label class="label_name" style="margin-left:20px;" th:text="'商品总金额：￥'+${detailMessage.p_price*detailMessage.number}"></label><br/>
                        <label class="label_name" style="margin-left:20px;" th:text="'应付款：￥'+${detailMessage.p_price*detailMessage.number}"></label>
                    </div>
                    <div style="position: absolute;right: 150px;">
                        <br/><br/><br/><br/><label class="label_name" style="margin-left:20px;" th:text="'打印时间：'+${#dates.format(new java.util.Date().getTime(), 'yyyy-MM-dd HH:mm:ss')}">
                        18:15:15</label><label class="label_name" style="margin-left:20px;" th:text="'操作者：'+${user.userName}"></label>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    jQuery(function ($) {
        var oTable1 = $('#sample-table').dataTable({
            "aaSorting": [
                [1, "desc"]
            ],//默认第几个排序
            "bStateSave": true,//状态保存
            "aoColumnDefs": [
                //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
                {"orderable": false, "aTargets": [0, 8, 9]}// 制定列不参与排序
            ]
        });


        $('table th input:checkbox').on('click', function () {
            var that = this;
            $(this).closest('table').find('tr > td:first-child input:checkbox')
                .each(function () {
                    this.checked = that.checked;
                    $(this).closest('tr').toggleClass('selected');
                });

        });


        $('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});

        function tooltip_placement(context, source) {
            var $source = $(source);
            var $parent = $source.closest('table')
            var off1 = $parent.offset();
            var w1 = $parent.width();

            var off2 = $source.offset();
            var w2 = $source.width();

            if (parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2)) return 'right';
            return 'left';
        }
    })
    /*用户-添加*/
    $('#member_add').on('click', function () {
        layer.open({
            type: 1,
            title: '添加计划',
            maxmin: true,
            shadeClose: true, //点击遮罩关闭层
            area: ['800px', ''],
            content: $('#add_menber_style'),
            btn: ['提交', '取消'],
            yes: function (index, layero) {
                var num = 0;
                var str = "";
                $(".add_menber input[type$='text']").each(function (n) {
                    if ($(this).val() == "") {

                        layer.alert(str += "" + $(this).attr("name") + "不能为空！\r\n", {
                            title: '提示框',
                            icon: 0,
                        });
                        num++;
                        return false;
                    }
                });
                if (num > 0) {
                    return false;
                } else {
                    layer.alert('添加成功！', {
                        title: '提示框',
                        icon: 1,
                    });
                    layer.close(index);
                }
            }
        });
    });

    /*用户-查看*/
    function member_show(title, url, id, w, h) {
        layer_show(title, url + '#?=' + id, w, h);
    }

    /*用户-编辑*/
    function member_edit(id) {
        layer.open({
            type: 1,
            title: '修改计划',
            maxmin: true,
            shadeClose: false, //点击遮罩关闭层
            area: ['800px', ''],
            content: $('#add_menber_style'),
            btn: ['提交', '取消'],
            yes: function (index, layero) {
                var num = 0;
                var str = "";
                $(".add_menber input[type$='text']").each(function (n) {
                    if ($(this).val() == "") {

                        layer.alert(str += "" + $(this).attr("name") + "不能为空！\r\n", {
                            title: '提示框',
                            icon: 0,
                        });
                        num++;
                        return false;
                    }
                });
                if (num > 0) {
                    return false;
                } else {
                    layer.alert('添加成功！', {
                        title: '提示框',
                        icon: 1,
                    });
                    layer.close(index);
                }
            }
        });
    }

    /*用户-删除*/
    function member_del(obj, id) {
        layer.confirm('确认要删除吗？', function (index) {
            $(obj).parents("tr").remove();
            layer.msg('已删除!', {icon: 1, time: 1000});
        });
    }

    laydate({
        elem: '#start',
        event: 'focus'
    });
    laydate({
        elem: '#end',
        event: 'focus'
    });
</script>
